<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>提交kPI</title>
    <link rel="stylesheet" href="/vendor/simple-line-icons/css/simple-line-icons.css">
    <link rel="stylesheet" href="/vendor/font-awesome/css/fontawesome-all.min.css">
    <link rel="stylesheet" href="/css/styles.css">
</head>
<body>
<div class="content">
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header bg-light">
                    <b>提交关于<span th:text="${user.userName}"></span>(工号：<span
                            th:text="${user.userId}"></span>)的优秀绩效信息</b>
                </div>
                <div class="card-body">
                    <form id="add_form" action="/hr/add_excellentKpi" method="post">
                        <input type="hidden" name="userId" th:value="${user.userId}"/>
                        <input type="hidden" name="userName" th:value="${user.userName}"/>
                        <div class="mb-4">
                            <b><p>员工优秀绩效审核提交</p></b>
                            <div class="row mt-4">
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="kpiMs">优秀绩效事件说明</label>
                                        <textarea id="kpiMs" name="kpiMs" class="form-control" rows="6"></textarea>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label class="form-control-label">优秀绩效时间</label>
                                        <input class="form-control" placeholder="请输入时间(格式：yyyy-MM-dd)" id="kpiTime"
                                               name="kpiTime">
                                    </div>
                                </div>
                            </div>
                            <div class="row mt-4">
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="kpiResult">奖励说明</label>
                                        <textarea id="kpiResult" name="kpiResult" class="form-control"
                                                  rows="6"></textarea>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label class="form-control-label">优秀绩效分数</label>
                                        <input class="form-control" placeholder="请输入优秀绩效分数" id="kpiPoint"
                                               name="kpiPoint">
                                    </div>
                                </div>
                            </div>
                            <div class="row mt-4">
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="single-select">优秀绩效类别</label>
                                        <select id="single-select" name="kpiDegree" class="form-control">
                                            <option value="1">为公司挽回重大损失</option>
                                            <option value="2">为公司提供了个人资源</option>
                                            <option value="3">年度十佳员工</option>
                                            <option value="4">老员工加成</option>
                                            <option value="5">受到社会嘉奖</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="row mt-4">
                                <div class="form-group">
                                    &emsp;&emsp;<button id="kp_add" type="button" class="btn btn-outline-primary">
                                    确定提交
                                </button>
                                    &emsp;&emsp;<button type="reset" class="btn btn-outline-danger">重置信息</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="/vendor/jquery/jquery.min.js"></script>
<script src="/vendor/popper.js/popper.min.js"></script>
<script src="/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="/vendor/chart.js/chart.min.js"></script>
<script>

    $("#kp_add").click(function () {
        if (!checkForm1()) {
            alert("提交的优秀加分信息不能为空!");
            return false;
        }
        var bagin = $('#kpiTime').val();
        var bagin_r = bagin.match(/^(\d{4})(-)(\d{2})(-)(\d{2})$/);
        if (bagin_r == null) {
            alert("请输入正确的加分时间格式,如:2019-01-01");
            return false;
        }
        var number1 = $("#kpiPoint").val();

        if (!checkRate(number1)) {
            alert("优秀加分的分数请输入正整数");
            return false;
        }
        $("#add_form").submit();
        alert("提交成功！");
    });

    function checkRate(nubmer) {
        var re = /^[1-9]+[0-9]*]*$/; //判断字符串是否为数字 //判断正整数 /^[1-9]+[0-9]*]*$/
        if (!re.test(nubmer)) {
            return false;
        } else {
            return true;
        }
    }

    function checkForm1() {
        var input_cart = document.getElementById("add_form").getElementsByTagName("INPUT");
        for (var i = 0; i < input_cart.length; i++) {
            if (input_cart[i].value == "" || input_cart[i].value == null) {
                input_cart[i].focus();
                return false;
            }
        }
        return true;
    }
</script>
</body>
</html>
